define(['vue','layer'],function (Vue,layer){
    'use strict';
    const mufile = {
        template:`<div class="flex-row flex-item-center flex-content-center">
    <el-input type="text" v-model="showList" @input="changeUrl" style="width: 240px"></el-input>
<el-upload
                                class="avatar-uploader"
                                :action="uploadurl"
                                :limit="1"
                                :show-file-list="false"
                                :on-success="handleFileSuccess"
                                :on-remove="handleRemove"
                        >
                            <el-button type="primary" style="margin-left: 5px;" color="#626aef">上传</el-button>
                        </el-upload><el-button style="margin-left: 5px;margin-top: -2px" type="primary" color="#626aef" @click="handleShowAttachment">选择文件</el-button></div>`,
        props:{
            modelValue: { type: String, default: '' },
        },
        emits: ['update:modelValue'],
        data(){
            return {
                uploadurl: Config.upload.uploadurl
            }
        },
        setup(props, { emit }) {
            const showList = Vue.ref(props.modelValue)


            Vue.onMounted(() => {
                const style = document.createElement('style');
                style.textContent = `
                    .custom-upload-wrapper {
                        display: flex;
                        align-items: center;
                    }
                    .custom-upload .el-upload-list--picture-card .el-upload-list__item {
                        width: 100px;
                        height: 100px;
                        margin: 0 8px 8px 0;
                    }
                    .custom-upload .el-upload-list__item-thumbnail {
                        object-fit: contain;
                        max-width: 100%;
                        max-height: 100%;
                    }
                    .custom-upload .el-upload--picture-card {
                        width: 100px;
                        height: 100px;
                    }
                    .upload-tip {
                        color: #999;
                        font-size: 12px;
                        margin-top: 8px;
                    }
                `;
                document.head.appendChild(style);

            });
            Vue.watch(()=>props.modelValue,(newvalue)=>{
                if(newvalue){
                    showList.value = newvalue
                }else{
                    showList.value = ''
                }
            })
            /**
             * 上传成功
             * @param response
             * @param uploadFile
             */
            const handleFileSuccess = (response,uploadFile)=>{

                if(response.code==1){
                    showList.value = response.data.url;
                    updateValue()
                }
            }
            const updateValue = ()=>{
                emit('update:modelValue',showList.value)
            }
            /**
             * 移除图片
             * @param uploadFile
             * @param uploadFiles
             */
            const handleRemove = (uploadFile, uploadFiles)=>{
                showList.value = '';
                updateValue()
            }
            const changeUrl = (value)=>{
                updateValue()
            }
            const handleShowAttachment = (multiple=0)=>{
                let url = Config.domain+Config.attachment_url+`?select=1&multiple=${multiple}`
                let option = {
                    callback:function (res){
                        // console.log(res)
                        showList.value = res
                        updateValue()
                    }
                }
                if(option.callback){
                    window.callback = option.callback
                }
                if(option.success){
                    window.success = option.success
                }
                if(option.cancel){
                    window.cancel = option.cancel
                }
                if(option.end){
                    window.end = option.end
                }
                if(option.close){
                    window.close = option.close
                }
                if(url.indexOf('http')==-1){
                    url = Config.moduleurl+'/'+url;
                }
                option.title = option.title||'页面'
                option.shadeClose = option.shadeClose||true
                option.shade = option.shade||0.8
                option.area = option.area||['99%','99%']
                option.success = option.success||null
                option.cancel = option.cancel||null
                option.end = option.end||null
                option.close = option.close||null
                option.content = url
                option.type = option.type||2
                layer.open(option)
            }
            return {
                handleFileSuccess,
                showList,
                handleRemove,
                changeUrl,
                handleShowAttachment,
                updateValue
            }
        }
    }
    return mufile;
})